<template>
    <div>
        <h1>全局状态中的name:{{ $store.state.name }}</h1>
        <button @click="add">点击增加</button>
        <h3>number:{{ number }}</h3>
        <h3>全局状态中的count:{{ $store.state.count }}</h3>
    </div>
</template>
  
<script>
import { ref } from 'vue'
import { useStore } from 'vuex'
export default {
    name: 'Counter',
    props: {

    },
    setup() {
        const store = useStore();
        const state = store.state;
        const number = ref(0);
        const add = function () {
            number.value = number.value++;
            store.commit('increment')
        }
        return {
            add,
            number
        }
    }
}
</script>
  

<style scoped></style>
  